<template>
  <div class="item">
    <h3>{{ pname }}</h3>
    <p>价格：{{ price }}</p>
    <p>介绍：{{ info }}</p>
    <button @click="$emit('kanyidao', id)">砍一刀</button>
  </div>
</template>

<script>
export default {
  // 子组件使用props介绍父组件传递过来的数据
  // 接收到的数据，可以data数据用法一样，只是不能修改
  // props: ['username', 'age', 'sex']
  // props: ['id', 'pname', 'price', 'info']
  props: {
    // id: {/*这里对id进行一些配置，比如要求id必传，而且要求是数字格式*/},
    id: {
      required: true, // 要求父组件必须给子组件传id
      type: Number // 要求必须传递数字格式；
      // 除了Number，其他类型还有String、Array、Boolean、Object。
      // 如果允许父组件传递的id，既允许是数字又允许是字符串，可以 type: [Number, String]
    },
    pname: {
      // 默认值如果是数组或对象，必须写成函数，函数里面返回数组或对象
      default: '好吃的东西'
    },
    price: [Number, String], // 只要求price是数字类型的，可以直接这样写
    info: String
  }
}
</script>

<style>
.item {
  border: solid 3px black;
  margin: 8px;
  padding: 10px;
}
</style>
